<template>
  <div class="Navigation">
    <ul>
      <li>
        <a href="javascript:;">豆瓣</a>
      </li>
      <li>
        <a href="javascript:;">读书</a>
      </li>
      <li>
        <a href="javascript:;">电影</a>
      </li>
      <li>
        <a href="javascript:;">音乐</a>
      </li>
      <li>
        <a href="javascript:;">同城</a>
      </li>
      <li>
        <a href="javascript:;">小组</a>
      </li>
      <li>
        <a href="javascript:;">阅读</a>
      </li>
      <li>
        <a href="javascript:;">FM</a>
      </li>
      <li>
        <a href="javascript:;">时间</a>
      </li>
      <li>
        <a href="javascript:;">豆品</a>
      </li>
    </ul>
    <ul>
      <li>
        <a href="JavaScript:;">下载豆瓣客户端</a>
      </li>
      <li>
        <a href="javascript:;">登陆/注册</a>
      </li>
    </ul>
  </div>
</template>
<script>
export default {};
</script>
<style lang="less" rel="stylesheet/less" scoped>
.Navigation {
  width: 100%;
  height: 28px;
  background: #545652;
  font-size: 12px;
  ul:nth-child(1) {
    float: left;
    li {
      line-height: 28px;
      float: left;
      list-style: none;
      a {
        text-decoration: none;
        color: #d5d5d5;
        padding: 0 12px;
      }
    }
  }
  ul:nth-child(2) {
    float: right;
    li {
      line-height: 28px;
      float: left;
      list-style: none;
      a {
        text-decoration: none;
        color: #d5d5d5;
        padding: 0 12px;
      }
    }
  }
}
</style>